<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
        <style type="text/css">
        .time-item {
            width: 430px;
            height: 45px;
            margin: 0 auto;
        }

        .time-item strong {
            background: orange;
            color: #fff;
            line-height: 49px;
            font-size: 36px;
            font-family: Arial;
            padding: 0 10px;
            margin-right: 10px;
            border-radius: 5px;
            box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
        }

        .time-item > span {
            float: left;
            line-height: 49px;
            color: orange;
            font-size: 32px;
            margin: 0 10px;
            font-family: Arial, Helvetica, sans-serif;
        }
        .title {
            width: 260px;
            height: 50px;
            margin:200px auto 50px auto;
        }
    </style>
</head>
<body>
<h1 class="title">距离光棍节，还有</h1>

<div class="time-item">
    <span><span id="day">00</span>天</span>
    <strong><span id="hour">00</span>时</strong>
    <strong><span id="minute">00</span>分</strong>
    <strong><span id="second">00</span>秒</strong>
</div>
<script>
    var day=document.getElementById("day");
    var huor=document.getElementById("hour");
    var minute=document.getElementById("minute");
    var second=document.getElementById("second");

    setInterval(function () {
        day.innerText=getLastTimes('2018-10-1').day;
        huor.innerText=getLastTimes('2018-10-1').hour;
        minute.innerText=getLastTimes('2018-10-1').minute;
        second.innerText=getLastTimes('2018-10-1').second;
    },1000);
    function getLastTimes(time) {
        // 1. 求 结束时间总的毫秒数  endTime
        var endTime = +new Date(time);
        // console.log(endTime); // 时间更大

        // 2. 现在时间总的毫秒数
        var nowTime = +new Date();
        // console.log(nowTime); // 时间更小
        // 3. 求 剩余的总的毫秒数  我们把毫秒数 转换为剩余的总的秒数
        var lastTime = (endTime - nowTime) / 1000;
       // console.log(lastTime);

        var d = Math.floor(lastTime / 60 / 60 / 24);
        var h = Math.floor(lastTime / 60 / 60 % 24);
        var m = Math.floor(lastTime / 60 % 60);
        var s = Math.floor(lastTime % 60);

        return {
            day:d,
            hour:h,
            minute:m,
            second:s,
        }
    }



    //var date = new Date(2018, 10, 1);
    //console.log(date);Thu Nov 01 2018 00:00:00 GMT+0800 (中国标准时间)
</script>
</body>
</html>